New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix modals in Edge. #12241
Fix modals in Edge. #12241
Conversation
This PR fixes #11585. Edge has a buggy implementation of `position: sticky;`, which includes issues with flickering, z-index, and parent container paddings. See more at https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/17555420/. This is mainly an issue in deeply nested elements, it seems. This PR includes an edge only hack that overrides the sticky and uses `position: fixed;` instead.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Coolio, thanks!
@@ -66,13 +66,20 @@ | |||
justify-content: space-between; | |||
background: $white; | |||
align-items: center; | |||
box-sizing: border-box; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Was this just not needed anymore? It doesn’t seem related to the other changes.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, good catch, I should've noted that as a code comment. Turns out that rule was written out twice in the same rule. Here it is on line 61, still there:
box-sizing: border-box; |
Thank you for the review.
This PR fixes #11585. Edge has a buggy implementation of `position: sticky;`, which includes issues with flickering, z-index, and parent container paddings. See more at https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/17555420/. This is mainly an issue in deeply nested elements, it seems. This PR includes an edge only hack that overrides the sticky and uses `position: fixed;` instead.
This PR fixes #11585.
Edge has a buggy implementation of
position: sticky;
, which includes issues with flickering, z-index, and parent container paddings. See more at https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/17555420/.This is mainly an issue in deeply nested elements, it seems.
This PR includes an edge only hack that overrides the sticky and uses
position: fixed;
instead.JIFs, Edge:
IE 11:
Chrome, Mac:
Safari, Mac:
Firefox, Mac: